<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<style type="text/css">
	.parent{
		max-width:500px;
		margin:auto;
		overflow:hidden;
		color:#fff;
		text-align: center;
	}
	.child{
		float:left;
		width:50%;
		border-bottom: 9999px solid transparent; 
		/*为什么不会影影响background的渲染？ 因为bg的渲染是在border-box里面开始， bordercolor 的渲染会覆盖bgColor的渲染 ， 具体请看bg-color的开始渲染位置*/
		margin-bottom: -9999px;
	}
	.child-1{
		background: red;
	}
	.child-2{
		background-color: #2121ac;
	}
</style>
</head>
<body>
	<div class="parent">
		<div class=" child child-1" >
			<h3>标题</h3>
			<p>我是内容1</p>
			<p>我是内容2</p>
			<p>我是内容3</p>
		</div>
		<div class="child child-2">
			
		</div>
	</div>
</body>
</html>